<template>
  <div class="allTop">
    <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
      <el-tab-pane label="农 资" name="first"
        ><slot name="nz"></slot
      ></el-tab-pane>
      <el-tab-pane label="农 具" name="second"
        ><slot name="nj"></slot
      ></el-tab-pane>
    </el-tabs>
  </div>
</template>
<script>
import PubSub from "pubsub-js";
export default {
  props: ["type"],
  data() {
    return {
      activeName: "first",
      idx: null
    };
  },
  methods: {
    handleClick(tab, event) {
      this.idx = tab.index;
      PubSub.publish("nongjuguanli",tab.index)
      PubSub.publish("kucunguanli",tab.index)
      // console.log(tab.index);
      this.$emit("classification", this.idx);
    }
  },
};
</script>

<style scoped>
.allTop >>> .el-tabs__item.is-active {
  background: #089867;
  color: white;
}
.allTop .el-tabs__item {
  background: rgb(164, 223, 164);
  color: green;
}
.allTop /deep/ .el-tabs__nav {
  border: none;
}
.allTop /deep/ .el-tabs__nav div{
  border:1px solid #e4e7ed;
}
.allTop /deep/ .el-tabs__nav div:first-child {
  border-left:1px solid #e4e7ed;
  border-top-left-radius: 8px;
}
.allTop /deep/ .el-tabs__nav div:last-child {
  border-top-right-radius: 8px;
}
</style>
